// 画布的配置info
export const useCanvasStore = defineStore({
  id: "canvasStore",
  state: () => ({
    canvasConfig: {}, // 画布配置
    componentList: [] as any, // 画布上的组件列表
    activeChartComponentIndex: -1, // 当前激活的组件索引
    itemConfig: {
      request: {
        url: "",
        method: "get",
        params: {},
      }, // 请求方式
      x: 0, // 左侧位置
      y: 0, // 上侧位置
      width: 400, // 默认宽度
      height: 260, // 默认高度
      options: {}, // 图表的配置
    }, // 每个组件的配置信息
  }),
  actions: {
    // 设置激活的组件的索引
    setActiveChartComponentIndex(index: number) {
      this.activeChartComponentIndex = index;
    },
    // 添加一个组件
    addComponentList(item: any) {
      let obj = {
        ...this.itemConfig,
        ...item,
      };
      console.log(obj);
      this.componentList.push(obj);
    },
    // 删除一个组件
    deleteComponent(index: number) {
      this.componentList.splice(index, 1);
    },
  },
});
